<template>
  <div class="layout-padding">
    <div class="layout-padding-auto layout-padding-view">
      <el-row>
        <div class="mb8" style="width: 100%">
          <el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
                     v-auth="'knowledge_aiDataset_add'">
            新 增
          </el-button>
          <el-button plain :disabled="multiple" icon="Delete" type="primary"
                     v-auth="'knowledge_aiDataset_del'" @click="handleDelete(selectObjs)">
            删除
          </el-button>
          <right-toolbar v-model:showSearch="showSearch" :export="'knowledge_aiDataset_export'"
                         @exportExcel="exportExcel" class="ml10 mr20" style="float: right;"
                         @queryTable="getDataList"></right-toolbar>
        </div>
      </el-row>
      <el-scrollbar>
        <div class="mx-auto mt-4">
          <div class="px-4">
            <div class="grid sm:grid-cols-2 sm:gap-x-6 lg:grid-cols-3">
              <div @dblclick="go2document(dataset)" class="mb-6 rounded-lg bg-gray-100 p-6"
                   v-for="dataset in state.dataList">
                <div class="flex items-center justify-between">
                  <div class="flex items-center">
                    <div class="h-16 w-16 rounded-full border overflow-hidden mr-4">
                      <img
                          :src="baseURL + dataset.avatarUrl"
                          alt="Avatar"
                          class="h-full w-full"
                      />
                    </div>
                    <h3 class="text-base font-semibold text-gray-900">{{ dataset.name }}</h3>
                  </div>
                  <div class="flex items-end">
                    <svg t="1710946275094" class="mr-2 h-5 w-5 text-base text-gray-500" viewBox="0 0 1077 1024"
                         version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="4319" width="128" height="128">
                      <path
                          d="M979.604466 500.329026C947.282825 500.329026 919.135953 517.290667 903.224568 542.549333L670.724055 483.997538C671.170414 479.350154 671.432978 474.624 671.432978 469.845333 671.432978 429.042872 654.707645 392.126359 627.637286 365.397333L664.39626 302.670769 764.118107 334.178462C768.424158 351.822769 783.127748 365.974974 802.399953 368.731897 827.711132 372.329026 851.158107 354.999795 854.834004 330.003692 858.483645 305.00759 840.944363 281.823179 815.633184 278.199795 801.586004 276.204308 788.247748 280.825436 778.401594 289.463795L688.735953 261.133128 739.095748 175.24841C741.878927 175.904821 744.504568 176.876308 747.392773 177.270154 796.702312 184.306872 842.414722 150.541128 849.530209 101.835487 856.671953 53.129846 822.486107 7.942564 773.176568 0.932103 723.86703-6.104615 678.154619 27.661128 671.012876 76.366769 666.733081 105.642667 677.576978 133.474462 697.453081 152.667897L588.882825 337.906872C568.717902 327.903179 546.032363 322.126769 521.928978 322.126769 487.480568 322.126769 455.841594 333.758359 430.556671 353.083077L402.33103 321.155282 443.054722 212.453744C461.066619 209.014154 476.032773 195.124513 479.682414 176.219897 484.487337 151.40759 468.024568 127.461744 442.897184 122.73559 417.796055 118.009436 393.561389 134.28841 388.782722 159.100718 386.130825 172.859077 390.174312 186.249846 398.471337 196.358564L366.77985 280.982974 278.952158 181.707487C286.277696 170.12841 291.318927 156.921436 292.579235 142.375385 296.78026 93.32841 259.942517 50.215385 210.317902 46.066872 160.693286 41.918359 117.055132 78.283487 112.854107 127.330462 108.653081 176.351179 145.464568 219.464205 195.089184 223.612718 212.786004 225.109333 229.590107 221.249641 244.214927 213.714051L288.772055 264.073846 143.154004 293.927385C138.42785 288.991179 132.65144 284.921436 125.746004 282.400821 101.773902 273.657436 75.149902 285.735385 66.301491 309.444923 57.453081 333.128205 69.688568 359.410872 93.660671 368.180513 117.632773 376.897641 144.256773 364.819692 153.105184 341.13641 153.288978 340.663795 153.341491 340.191179 153.472773 339.692308L324.638312 304.613744 397.893696 387.400205C381.824773 410.952205 372.451235 439.309128 372.451235 469.845333 372.451235 483.603692 374.472978 496.863179 378.04385 509.466256L166.73226 609.056821C153.42026 587.657846 131.417389 571.720205 104.34703 567.466667 55.168773 559.721026 8.957491 592.856615 1.133081 641.457231-6.691329 690.057846 26.838107 735.717744 76.042619 743.437128 125.220876 751.182769 171.432158 718.047179 179.256568 669.446564 180.04426 664.484103 180.149286 659.60041 180.12303 654.742974L397.788671 552.159179C420.316671 585.268513 456.104158 608.715487 497.589286 615.437128L500.897594 664.641641 392.064773 708.46359C387.023543 704.682667 381.142107 701.820718 374.578004 700.324103 349.686927 694.652718 324.822107 710.012718 319.124466 734.641231 313.374312 759.243487 328.944363 783.793231 353.83544 789.438359 378.752773 795.083487 403.591337 779.723487 409.315235 755.121231 409.551543 754.070974 409.525286 753.046974 409.709081 751.996718L504.232158 713.951179 512.581696 838.117744C486.797902 848.856615 466.344158 871.069538 459.59626 900.056615 448.437286 948.027077 478.737184 995.84 527.285286 1006.867692 575.807132 1017.895385 624.223953 987.963077 635.382927 939.992615 646.541902 892.04841 616.242004 844.209231 567.693902 833.207795 565.015748 832.603897 562.416363 832.551385 559.738209 832.210051L545.192158 615.620923C596.15585 607.744 638.559953 574.555897 658.751132 529.394872L705.06744 541.052718 713.023132 646.498462C700.945184 654.742974 692.989491 668.475077 692.989491 684.097641 692.989491 709.356308 713.732055 729.810051 739.279543 729.810051 764.82703 729.810051 785.543337 709.356308 785.543337 684.097641 785.543337 666.400821 775.277081 651.224615 760.389696 643.636513L753.56303 553.261949 889.650004 587.526564C889.623748 588.182974 889.439953 588.786872 889.439953 589.443282 889.439953 638.647795 929.822312 678.531282 979.630722 678.531282 1029.439132 678.531282 1069.821491 638.647795 1069.821491 589.443282 1069.795235 540.212513 1029.412876 500.329026 979.604466 500.329026"
                          fill="#000000" p-id="4320"></path>
                    </svg>
                    <span class="mr-1">文档数：{{ dataset.units || 0}}</span>
                  </div>
                </div>
                <div class="h-16 overflow-y-auto">
                  <p class="my-3 text-sm font-normal text-gray-500">
                    {{ dataset.description }}
                  </p>
                </div>
                <div class="flex items-center justify-between text-sm font-semibold text-gray-900">
                  <div class="flex">
                    <svg t="1710946369397" class="mr-1 h-5 w-6" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="5597" width="64" height="64">
                      <path
                          d="M658.7 873.6h36.7v-36.7h-36.7v36.7z m73.5 0h36.7v-36.7h-36.7v36.7z m73.4 0h36.7v-36.7h-36.7v36.7z m-661-73.5h771.2v110.2H144.6V800.1zM107.9 947h844.6V763.4H107.9V947z"
                          fill="" p-id="5598"></path>
                      <path d="M181.3 65.7l-73.4 697.7h38.3l71.8-661h624.3l71.9 661h38.3L879.1 65.7z" fill=""
                            p-id="5599"></path>
                      <path
                          d="M288.6 503c0-56 45.4-101.5 101.5-101.5h1.4c5.7-34.9 26.1-60.1 31.6-66.4 26.4-31.8 66.2-52 110.7-52 65.1 0 120.1 43.3 137.8 102.7 6.9 11.2 6.9 62 6.9 66.2v0.6c2.5-0.2 4.9-0.4 7.5-0.4 42 0 76.1 44.1 76.1 76.1 0 32-31 42.3-42.2 42.3-1.6 0-4.6 0-8.8-0.2v0.2H322.4c-7 0-33.8-11.7-33.8-67.6m77-133.1c-63 11.6-110.8 66.8-110.8 133.1 0 74.7 38.8 101.5 50.8 101.5h405.6v0.4c21.6 0 84.8-15.8 84.8-76.5 0-52-36.1-95.6-84.7-107-2.8-95.6-81.2-172.1-177.5-172.1-78.1 0-144.5 50.5-168.2 120.6"
                          fill="" p-id="5600"></path>
                      <path d="M407.7 401.6H427c15.6-43.2 55.4-74.8 103.1-78.5v-18.4c-57.8 3.8-106 43.4-122.4 96.9"
                            fill="" p-id="5601"></path>
                    </svg>
                    容量：{{ dataset?.fileSize / 1000 || 0 }} KB
                  </div>
                  <div class="flex items-center">
                    <el-button class="!p-0" icon="link" @click="mountDialogRef.openDialog(dataset.id)" text
                               type="primary"
                               v-if="dataset.publicFlag === '1'"
                               v-auth="'knowledge_aiDataset_edit'"
                    >发布</el-button>

                    <el-button class="!p-0" icon="edit-pen" @click="formDialogRef.openDialog(dataset.id)" text
                               type="primary"
                               v-auth="'knowledge_aiDataset_edit'"
                    >{{ $t('common.editBtn') }}
                    </el-button>
                    <el-button
                        class="!p-0"
                        icon="delete"
                        @click="handleDelete([dataset.id])"
                        text
                        type="primary"
                        v-auth="'knowledge_aiDataset_del'"
                    >{{ $t('common.delBtn') }}
                    </el-button>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </el-scrollbar>
      <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination"/>
    </div>

    <!-- 编辑、新增  -->
    <form-dialog ref="formDialogRef" @refresh="getDataList(false)"/>
    <mount-dialog ref="mountDialogRef"/>
  </div>
</template>

<script setup lang="ts" name="systemAiDataset">
import {BasicTableProps, useTable} from "/@/hooks/table";
import {fetchList, delObjs} from "/@/api/knowledge/aiDataset";
import {useMessage, useMessageBox} from "/@/hooks/message";
import {useDict} from '/@/hooks/dict';

const router = useRouter();

// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
const MountDialog = defineAsyncComponent(() => import('./mount.vue'));
// 定义查询字典

// 定义变量内容
const formDialogRef = ref()
const mountDialogRef = ref()
// 搜索变量
const queryRef = ref()
const showSearch = ref(true)
// 多选变量
const selectObjs = ref([]) as any
const multiple = ref(true)

const state: BasicTableProps = reactive<BasicTableProps>({
  queryForm: {},
  pageList: fetchList
})

//  table hook
const {
  getDataList,
  currentChangeHandle,
  sizeChangeHandle,
  sortChangeHandle,
  downBlobFile,
  tableStyle
} = useTable(state)

// 清空搜索条件
const resetQuery = () => {
  // 清空搜索条件
  queryRef.value?.resetFields()
  // 清空多选
  selectObjs.value = []
  getDataList()
}

// 导出excel
const exportExcel = () => {
  downBlobFile('/knowledge/aiDataset/export', Object.assign(state.queryForm, {ids: selectObjs}), 'aiDataset.xlsx')
}

// 多选事件
const selectionChangHandle = (objs: { id: string }[]) => {
  selectObjs.value = objs.map(({id}) => id);
  multiple.value = !objs.length;
};

// 删除操作
const handleDelete = async (ids: string[]) => {
  try {
    await useMessageBox().confirm('此操作将永久删除');
  } catch {
    return;
  }

  try {
    await delObjs(ids);
    getDataList();
    useMessage().success('删除成功');
  } catch (err: any) {
    useMessage().error(err.msg);
  }
};

const go2document = (dataset: any) => {
  router.push({
    path: '/knowledge/aiDocument/index',
    query: {
      datasetId: dataset.id
    }
  })
}

// 跳转发布页
const addOrUpdate = (id?: string) => {
  router.push({
    path: '/biz/app/appArticle/form',
    query: { id: id, tagsViewName: '知识库维护' },
  });
};
</script>
